<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>
<%@ include file="/WEB-INF/views/include/easyui.jsp"%>
<script src="${ctx}/static/plugins/My97DatePicker/WdatePicker.js" type="text/javascript"></script>

</head>
<body class="easyui-layout" style="font-family: '微软雅黑'">

	<div data-options="region:'north',split:false,border:true" style="height: 72px">
		<div id="tb" style="padding:5px;height:auto">
			<div>
				<form name="searchFrom" id="searchFrom" action="">
					<input type="text" name="beginDate" class="easyui-my97" datefmt="yyyy-MM-dd" onfocus="WdatePicker({minDate:'2015-06-24',maxDate:'%y-%M-%d'})" data-options="width:150,prompt: '开始日期'"/> - 
					<input type="text" name="endDate" class="easyui-my97" datefmt="yyyy-MM-dd" onfocus="WdatePicker({minDate:'2015-06-24',maxDate:'%y-%M-%d'})" data-options="width:150,prompt: '结束日期'"/>
					&nbsp;<span class="toolbar-item dialog-tool-separator"></span>&nbsp;
					<input type="checkbox" name="iOS" checked/>iOS
					<input type="checkbox" name="Android" checked/>android
					<input type="checkbox" name="all" checked/>全部
					<input type="hidden" name="iOS_checked" value="true"/>
					<input type="hidden" name="Android_checked" value="true"/>
					<input type="hidden" name="all_checked" value="true"/>
					&nbsp;<span class="toolbar-item dialog-tool-separator"></span>
					<a href="javascript(0)" class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="cx()">查询</a>
				</form>
				<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-standard-page-go" plain="true" onclick="exportData()">数据导出</a>
			</div> 
		</div>
	</div>
	
	<div data-options="region:'center',split:true,border:false,title:'产品相关'">
		<table id="dg"></table>
    </div>
		
	<div data-options="region:'south',split:false,border:true,title:'用户相关'" style="height: 172px">
    	<table id="dgUser"></table>
    </div>  
    
    <iframe id="fileDownFrame" src="" style="display:none; visibility:hidden;"></iframe> 
    
<script type="text/javascript">
var dg;
var dgUser;
$(function(){   
	showUserDataReport();
	showProductDataReport();
});

//用户相关
function showUserDataReport() 
{
	dgUser=$('#dgUser').datagrid({    
		method: "get",
	    url:'${ctx}/dataReport/userDataReport', 
	    fit : true,
		fitColumns : true,
		border : false,
		striped:true,
		idField : 'id',
		pagination:false,
		rownumbers:true,
		pageNumber:1,
		pageSize : 20,
		pageList : [ 10, 20, 30, 40, 50 ],
		singleSelect:true,
	    columns:[[    
			{field:'os',title:'系 统',align:'center',sortable:false,width:60,rowspan:2},
			{field:'totalRegistUserNum',title:'累计注册用户',align:'center',sortable:false,width:80,rowspan:2},
	        {field:'totalLoginUserNum',title:'累计登录用户',align:'center',sortable:false,width:80,rowspan:2},    
	        {field:'registUserNum',title:'注册数',align:'center',sortable:false,width:80,rowspan:2},  
	        {field:'loginTimesNum',title:'登录次数',align:'center',sortable:false,width:80,rowspan:2},  
	        {field:'loginUserNum',title:'登录用户数',align:'center',sortable:false,width:80,rowspan:2},
	        {field:'newUserNum',title:'新增登录用户',align:'center',sortable:false,width:80,rowspan:2}
	    ]],
	    enableHeaderClickMenu: false,
	    enableHeaderContextMenu: false,
	    enableRowContextMenu: false
	});
}

//产品相关
function showProductDataReport() 
{
	dg=$('#dg').datagrid({    
		method: "get",
	    url:'${ctx}/dataReport/productDataReport', 
	    fit : true,
		fitColumns : true,
		border : false,
		striped:true,
		idField : 'id',
		pagination:false,
		rownumbers:true,
		pageNumber:1,
		pageSize : 20,
		pageList : [ 10, 20, 30, 40, 50 ],
		singleSelect:true,
	    columns:[[    
			{field:'os',title:'系统',align:'center',sortable:false,width:30},
			{field:'pname',title:'产品名称',align:'center',sortable:false,width:100},
	        {field:'proAgentTimes',title:'代理次数',align:'center',sortable:false,width:40},    
	        {field:'proAgentUser',title:'代理理财师数',align:'center',sortable:false,width:40}, 
	        {field:'proCurrAgentUser',title:'当前代理人数',align:'center',sortable:false,width:40},  
	        {field:'proOrderTimes',title:'预约次数',align:'center',sortable:false,width:40},  
	        {field:'proOrderUser',title:'预约理财师数',align:'center',sortable:false,width:40},
	        {field:'proCurrOrderUser',title:'当前预约理财师数',align:'center',sortable:false,width:40},
	        {field:'proOrderCustomer',title:'预约客户数',align:'center',sortable:false,width:40},
	        {field:'proCurrOrderCustomer',title:'当前预约客户数',align:'center',sortable:false,width:40}
	    ]],
	    enableHeaderClickMenu: false,
	    enableHeaderContextMenu: false,
	    enableRowContextMenu: false
	});

}


//创建查询对象并查询
function cx(){
	var obj = $("#searchFrom").serializeObject();
	obj.iOS_checked = searchFrom.iOS.checked;
	obj.Android_checked = searchFrom.Android.checked;
	obj.all_checked = searchFrom.all.checked;
	
	if(obj.endDate != '') {
		dg.datagrid('hideColumn', 'proCurrAgentUser');
		dg.datagrid('hideColumn', 'proCurrOrderUser');
		dg.datagrid('hideColumn', 'proCurrOrderCustomer');
	} else {
		dg.datagrid('showColumn', 'proCurrAgentUser');
		dg.datagrid('showColumn', 'proCurrOrderUser');
		dg.datagrid('showColumn', 'proCurrOrderCustomer');
	}
	
	dg.datagrid('reload',obj); 
	dgUser.datagrid('reload',obj); 
	
}

//导出数据
function exportData(){
	var iOS_checked = searchFrom.iOS.checked;
	var Android_checked = searchFrom.Android.checked;
	var all_checked = searchFrom.all.checked;
	
  	var beginDate = $("input[name='beginDate']").val() ? $("input[name='beginDate']").val() : '';
  	var endDate = $("input[name='endDate']").val() ? $("input[name='endDate']").val() : '';
  
  	$("#fileDownFrame").attr("src", "${ctx}/dataReport/export?beginDate="+beginDate+"&endDate="+endDate+"&iOS_checked="+iOS_checked+"&Android_checked="+Android_checked+"&all_checked="+all_checked);
}

</script>
</body>
</html>